<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
		<title></title>
		<style type="text/css">
			.menu{
				display: flex;
				width: 100%;
				/* flex: 1; */
				justify-content:space-around;
				flex-wrap:wrap;
			}
			.item{
				/* flex-grow: 1; */
				/* width: 20%; */
			}
		</style>
	</head>
	<body>
		<!-- 菜单 -->
		<div class="menu">
			<div class="item">
				<img src="../2D/4.png" width="40px">
				<p>抢购</p>
			</div>
			<div class="item">
				<img src="../2D/4.png" width="40px">
				<p>抢购</p>
			</div>
			<div class="item">
				<img src="../2D/4.png" width="40px">
				<p>抢购</p>
			</div>
			<div class="item">
				<img src="../2D/4.png" width="40px">
				<p>抢购</p>
			</div>
			
			
		</div>
		<style type="text/css">
			.order{
				display:flex;
				flex-wrap: wrap;
				justify-content: space-around;
			}
			.shopping{
				width: 48%;
			}
			.shopping img{
				width: 100%;
			}
		</style>
		<!-- 商品 -->
		<div class="order">
			<div class="shopping">
				<img src="../2D/4.png" >
				<h4>标题</h4>
				<b>价格</b>
			</div>
			<div class="shopping">
				<img src="../2D/4.png" >
				<h4>标题</h4>
				<b>价格</b>
			</div>
			<div class="shopping">
				<img src="../2D/4.png" >
				<h4>标题</h4>
				<b>价格</b>
			</div>
			<div class="shopping">
				<img src="../2D/4.png" >
				<h4>标题</h4>
				<b>价格</b>
			</div>
		</div>
		
	</body>
</html>
